<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<!-- 用户卡片 -->
<div th:fragment="user_card(user, userId, followShow)">
    <section class="com-2-panel side J-authorPanel internal">
        <header class="com-2-panel-hd"><h3 class="com-2-panel-title">作者介绍</h3></header>
        <div class="com-2-panel-bd">
            <div class="com-author-intro">
                <div class="com-author-intro-object">
                    <a th:href="${'/user/' + user.userId}"
                       class="com-author-intro-avatar"
                       th:style="'background-image:url('+${user.photo}+');'"></a>
                </div>
                <h3 class="com-author-intro-name">
                    <a th:href="${'/user/' + user.userId}"
                       class="com-author-intro-name-inner"
                       th:title="${user.userName}"
                       th:text="${user.userName}">
                    </a>
                </h3>
                <div class="com-author-intro-desc">
                    <span th:text="'已加入'+ ${user.joinDayCount} + '天'"></span>
                    <div class="c-bubble-trigger com-verification">
                        <i class="verified"></i>
                    </div>
                </div>
                <div class="com-author-intro-btns">
                    <button type="button"
                            class="c-btn"
                            th:data-user-id="${userId}"
                            th:data-followed="${user.followed}"
                            th:if="${followShow == true && (global.isLogin && global.user.userId != user.userId)}"
                            th:text="${user.followed == true ? '取消关注' : '关注'}"
                            onclick="followAction(this)">
                        <span class="text">关注</span>
                    </button>
                    <a href="/column"
                       class="c-btn c-btn-hole">
                        <span class="text">教程</span>
                    </a>
                </div>
                <ul class="com-author-intro-infos">
                    <li class="com-author-intro-info">
                        <a th:href="${'/user/' + user.userId}"
                           class="com-author-intro-info-link">
                            <div class="com-author-intro-info-title">文章数</div>
                            <div class="com-author-intro-info-num" th:text="${user.articleCount}">757</div>
                        </a>
                    </li>
                    <li class="com-author-intro-info">
                        <a th:href="${'/user/' + user.userId}"
                           class="com-author-intro-info-link">
                            <div class="com-author-intro-info-title">点赞数</div>
                            <div class="com-author-intro-info-num" th:text="${user.praiseCount}">757</div>
                        </a>
                    </li>
                    <li class="com-author-intro-info">
                        <a th:href="${'/user/' + user.userId}"
                           class="com-author-intro-info-link">
                            <div class="com-author-intro-info-title">收藏数</div>
                            <div class="com-author-intro-info-num" th:text="${user.collectionCount}">757</div>
                        </a>
                    </li>
                    <li class="com-author-intro-info">
                        <a th:href="${'/user/' + user.userId}"
                           class="com-author-intro-info-link">
                            <div class="com-author-intro-info-title">粉丝数</div>
                            <div class="com-author-intro-info-num" th:text="${user.fansCount}">51.1K</div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </section>
</div>
</html>
